<template>
	<view class="sign-up">
		<u-toast ref="signUp" />
		<navBar title="设置" justCenter="justCenter"></navBar>
		<scroll-view scroll-y="true" class="scroll-Y" :style="{maxHeight:heightValue+'px'}">
			<view class="sign-up-title" style="padding: 60rpx 70rpx 0 70rpx;">
				注：请完成全部验证，中通退出小程序将注册失败
			</view>

			<view style="margin-top: 48rpx;padding: 0 70rpx 0 70rpx;">
				<view class="sign-up-item-title">
					昵称
				</view>
				<view class="sign-up-item-input">
					<u--input placeholder="请输入手机号" border="none" v-model="nike"
						placeholderStyle="font-size: 24rpx;font-family: PingFang SC, PingFang SC;font-weight: 400;color: #999999;"></u--input>
				</view>
			</view>
			<view style="margin-top: 48rpx;padding: 0 70rpx 0 70rpx;">
				<view class="sign-up-item-title">
					密码
				</view>
				<view class="sign-up-item-input">
					<u--input placeholder="请输入密码" border="none" v-model="passwrod"
						placeholderStyle="font-size: 24rpx;font-family: PingFang SC, PingFang SC;font-weight: 400;color: #999999;"></u--input>
				</view>
			</view>

			<view class="sign-up-btn" @click="rego()">
				注册
			</view>
		</scroll-view>
	</view>
</template>


<!-- 注册中 -->
<script>
	import navBar from '@/components/navBar/navBar.vue';
	import {
		getHeight
	} from '@/utiles/utils.js';
	import {
		myRequest
	} from '@/utiles/api.js'
	export default {
		components: {
			navBar
		},
		data() {
			return {
				heightValue: 0,
				phone: '',
				nike: '',
				passwrod: '',
			}
		},
		onShow() {
			const windowHeight = getHeight().windowHeight //100vh
			const statusBarHeight = getHeight().statusBarHeight //tabBar高度
			const navBareight = getHeight().navBareight //头部高度
			let phone = uni.getStorageSync('phone') || ''
			this.heightValue = windowHeight - statusBarHeight - navBareight
			if (phone) {
				this.phone = phone
			}
		},
		methods: {
			async rego() {
				const {
					phone,
					nike,
					passwrod
				} = this || {}
				if (!phone) return
				if (!nike) {
					this.$refs.signUp.show({
						type: 'error',
						message: '请输入设置昵称',
					})
					return
				}
				if (!passwrod) {
					this.$refs.signUp.show({
						type: 'error',
						message: '请输入设置密码',
					})
					return
				}

				this.$refs.signUp.show({
					type: 'loading',
					message: "加载中",
					duration: '60000',
					iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/loading.png'
				})
				let {
					success,
					data,
					message
				} = await myRequest({
					prefix: 'https://www.jk334.cn/api/',
					url: `Applet/SetUpUser`,
					method: 'POST',
					contentType: 'application/json',
					data: {
						phone,
						nike,
						passwrod,
					}
				})
				this.$refs.signUp.clearTimer()
				if (success) {
					uni.navigateTo({
						url: '/pages/Signup/SignSuccess'
					});
				} else {
					this.$refs.signUp.show({
						type: 'error',
						message: message,
					})
				}
				console.log(success, data, message, 'success,data,message ')
			}
		}
	}
</script>

<style scoped lang="scss">
	.sign-up {
		background-image: url("https://www.jk334.cn/img/home-bg.png");
		background-size: 100% 332rpx;
		background-repeat: no-repeat;
		font-family: PingFang SC, PingFang SC;

		.sign-up-item-title {
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			color: #323232;
			margin-bottom: 12rpx;
		}

		.sign-up-item-input {
			height: 80rpx;
			background: #F5F5F5;
			border-radius: 16rpx;
			box-sizing: border-box;
			padding: 0rpx 24rpx 0 24rpx;
			display: flex;
			align-items: center;
		}

		.sign-up-title {
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #FF2626;
		}

		.sign-up-btn {
			width: 520rpx;
			height: 80rpx;
			background: #FFCD2C;
			border-radius: 80rpx;
			font-size: 28rpx;
			font-weight: bold;
			color: #393319;
			line-height: 80rpx;
			text-align: center;
			margin: 0 auto;
			margin-top: 120rpx;
		}
	}
</style>